import 'package:async/async.dart';
import 'package:boss/models/package_group.dart';
import 'package:boss/provider/package_group_provider.dart';

import 'package:boss/ui/page/packageGroup/page/packageGroupDetail/package_group_detail_page.dart';
import 'package:boss/ui/page/packageGroup/widget/package_group_item.dart';
import 'package:boss/ui/widget/button/fixed_bottom_btn.dart';
import 'package:boss/ui/widget/center_title_app_bar.dart';
import 'package:boss/ui/widget/label_button.dart';
import 'package:boss/ui/widget/loader/loader.dart';
import 'package:hi_common/hi_common.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:router/annotation.dart';

@RouterConfig(PickerPackageGroupPage.pageName)
class PickerPackageGroupPage extends StatefulWidget {
  static const pageName = '/pickerPickerPackageGroupPage';

  @Autowired()
  final List<PackageGroup> selectedPackageGroups;

  const PickerPackageGroupPage({Key key, this.selectedPackageGroups}) : super(key: key);

  @override
  _PickerPackageGroupPageState createState() => _PickerPackageGroupPageState('选择套餐分组');
}

class _PickerPackageGroupPageState extends BaseState<PickerPackageGroupPage> {
  _PickerPackageGroupPageState(String pageName) : super(pageName);

  List<PackageGroup> packageGroups = [];

  List<PackageGroup> selectedPackageGroups = [];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: CenterTitleAppBar(
        title: '选择套餐分组',
        actions: <Widget>[
          LabelButton(
            title: '新增',
            padding: EdgeInsets.only(left: 8, top: 2, bottom: 2),
            onTap: () async {
              final res = await Navigator.pushNamed(context, PackageGroupDetailPage.pageName);
              if (res != null) {
                packageGroups.add(res);
                setState(() {});
              }
            },
          ),
        ],
      ),
      body: Loader<List<PackageGroup>>(
        loadTask: _loadTask,
        builder: (context) {
          return Column(
            children: <Widget>[
              Expanded(
                child: ListView.builder(
                  padding: EdgeInsets.symmetric(
                    horizontal: 30.w,
                  ),
                  itemBuilder: (context, index) {
                    var current = packageGroups[index];
                    var isSelected = selectedPackageGroups.contains(current);

                    return GestureDetector(
                      onTap: () {
                        setState(() {
                          selectedPackageGroups.contains(current) ? selectedPackageGroups.remove(current) : selectedPackageGroups.add(current);
                        });
                      },
                      child: PackageGroupItem(
                        data: current,
                        isSelected: isSelected,
                      ),
                    );
                  },
                  itemCount: packageGroups.length,
                ),
              ),
              FixedBottomBtn(
                title: '确定',
                onTap: () {
                  Navigator.of(context).pop(selectedPackageGroups);
                },
              ),
            ],
          );
        },
      ),
    );
  }

  Future<Result<List<PackageGroup>>> _loadTask() async {
    var packageGroupProvider = Provider.of<PackageGroupProvider>(
      context,
      listen: false,
    );

    var res = await packageGroupProvider.initData();

    packageGroups = [...res.asValue.value];

    selectedPackageGroups = packageGroups.where((packageGroup) => widget.selectedPackageGroups?.any((item) => item.id == packageGroup.id)).toList();

    return res;
  }
}

Future<List<PackageGroup>> pickerPackageGroup(BuildContext context, {List<PackageGroup> selectedPackageGroups}) {
  return Navigator.push(
      context,
      MaterialPageRoute(
        builder: (context) => PickerPackageGroupPage(selectedPackageGroups: selectedPackageGroups),
      ));
}
